import { defaultLang, changeLocale } from '@/i18n'
import { createRouter, createWebHistory } from 'vue-router'
// router可采用require.context方法引入
export const routes = [
  {
    path: '/',
    name: 'Home',
    component: () => import(/* webpackChunkName: "home" */ '../views/Home.vue'),
    meta: {
      title: '首页'
    }
  },
  // {
  //   path: '/skeleton',
  //   name: 'Skeleton',
  //   component: () =>
  //     import(/* webpackChunkName: "virtual" */ '../views/Skeleton.vue'),
  //   meta: {
  //     title: '骨架屏',
  //     keyWords: '骨架屏，Vue骨架屏',
  //     description: '骨架屏描述'
  //   }
  // },
  {
    path: '/loading',
    name: 'Loading',
    component: () =>
      import(/* webpackChunkName: "loading" */ '../views/Loading.vue'),
    meta: {
      title: 'v-loading效果'
    }
  },
  {
    path: '/lazy',
    name: 'Lazy',
    component: () => import(/* webpackChunkName: "lazy" */ '../views/Lazy.vue'),
    meta: {
      title: '图片懒加载'
    }
  },
  {
    path: '/async',
    name: 'Async',
    component: () => import(/* webpackChunkName: "async" */ '../views/Async/index.vue'),
    meta: {
      title: '异步组件'
    }
  },
  {
    path: '/pull',
    name: 'PullRefresh',
    component: () =>
      import(/* webpackChunkName: "pull" */ '../views/PullRefresh.vue'),
    meta: {
      title: '下拉刷新'
    }
  },
  {
    path: '/infinite',
    name: 'InfiniteScroll',
    component: () =>
      import(/* webpackChunkName: "infinite" */ '../views/InfiniteScroll.vue'),
    meta: {
      title: '上拉加载'
    }
  },
  {
    path: '/virtual',
    name: 'VirtualScroll',
    component: () =>
      import(/* webpackChunkName: "virtual" */ '../views/VirtualScroll.vue'),
    meta: {
      title: '虚拟滚动',
      keepAlive: true
    }
  },
  {
    path: '/websocket',
    name: 'WebSocket',
    component: () =>
      import(/* webpackChunkName: "websocket" */ '../views/Socket.vue'),
    meta: {
      title: 'WebSocket'
    }
  },
  {
    path: '/i18n',
    name: 'I18n',
    component: () => import(/* webpackChunkName: "i18n" */ '../views/I18n.vue'),
    meta: {
      i18nTitle: 'i18n'
    }
  },
  {
    path: '/call',
    name: 'Call',
    component: () => import(/* webpackChunkName: "call" */ '../views/Call.vue'),
    meta: {
      title: 'APP唤醒'
    }
  },
  {
    path: '/throttle',
    name: 'Throttle',
    component: () =>
      import(/* webpackChunkName: "throttle" */ '../views/Throttle.vue'),
    meta: {
      title: '点击防抖'
    }
  },
  {
    path: '/copy',
    name: 'Copy',
    component: () => import(/* webpackChunkName: "copy" */ '../views/Copy.vue'),
    meta: {
      title: '一键复制'
    }
  },
  {
    path: '/dark',
    name: 'Dark',
    component: () => import(/* webpackChunkName: "dark" */ '../views/Dark.vue'),
    meta: {
      title: '黑夜模式'
    }
  },
  // {
  //   path: '/persist',
  //   name: 'Persist',
  //   component: () =>
  //     import(/* webpackChunkName: "persist" */ '../views/Persist.vue'),
  //   meta: {
  //     title: '持久缓存'
  //   }
  // },
  {
    path: '/vconsole',
    name: 'VConsole',
    component: () =>
      import(/* webpackChunkName: "vconsole" */ '../views/VConsole.vue'),
    meta: {
      title: '控制台调试'
    }
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL + defaultLang),
  routes
})

// 这里可以做路由拦截
router.beforeEach((to, from, next) => {
  changeLocale(to.meta)
  next()
})

export default router
